(function (window,undefined) {
    var position = 'absolute';
    // 用于保存蛇节dom对象的数组
    var elements = [];
    // 蛇构造函数
    function Snake(options) {
        // 防止用户不传递参数导致代码报错
        options = options || {};
        this.width = options.width || 20;
        this.height = options.height || 20;
        this.position = position;
        // 记录蛇移动的方向
        this.direction = options.direction || 'right';
        // 蛇身配置项,蛇初始状态由3个蛇节组成
        this.body = [
            {
                x: 2,
                y: 0,
                color: 'red'
            },
            {
                x: 1,
                y: 0,
                color: 'blue'
            },
            {
                x: 0,
                y: 0,
                color: 'blue'
            }
        ]
    }

    // map:地图dom对象
    Snake.prototype.render = function (map) {
        for (var i = 0; i < this.body.length; i++) {
            var div = document.createElement('div');
            map.appendChild(div);
            // 将蛇节对象压入数组
            elements.push(div);
            div.style.position = this.position;
            div.style.width = this.width + 'px';
            div.style.height = this.height + 'px';
            div.style.backgroundColor = this.body[i].color;
            div.style.left = this.body[i].x * this.width + 'px';
            div.style.top = this.body[i].y * this.height + 'px';
        }
    }

    /*
        移动:删除原来的蛇,按照新坐标重新绘制一条蛇
        注意:此方法中只是修改蛇节的坐标信息,重新渲染交给render方法来完成
    */
    Snake.prototype.move = function (food, map) {
        // 1-删除原来的蛇
        // remove();
        // 2-移动蛇节:把前一节的坐标赋值给后一节即可;蛇头需要特殊处理,和移动方向相关
        for (var i = this.body.length - 1; i > 0; i--) {
            this.body[i].x = this.body[i - 1].x;
            this.body[i].y = this.body[i - 1].y;
        }
        var head = this.body[0];
        switch (this.direction) {
            // left
            case 'left':
                head.x -= 1;
                break;
            // top
            case 'top':
                head.y -= 1;
                break;
            // right
            case 'right':
                head.x += 1;
                break;
            // bottom
            case 'bottom':
                head.y += 1;
                break;
        }

        /*
            3-判断蛇头是否吃到食物
            注意:此处蛇节的x,y存储的不是具体的像素单位,要转换成具体的像素单位,在和食物的坐标进行比较
        */
        var headX = head.x * this.width;
        var headY = head.y * this.height;
        if (headX == food.x && headY == food.y) {
            // console.log('吃到食物了');
            // 1-重新生成食物
            food.render(map);
            // 2-增加蛇身
            var last = this.body[this.body.length - 1];
            // this.body[this.body.length]={
            //     x:last.x,
            //     y:last.y,
            //     color:last.color
            // }
            //使用对象的拷贝优化代码
            var obj = {};
            Tools.extend(last, obj);
            this.body[this.body.length] = obj;
        }

        // 3-重新渲染蛇身
        // this.render(map);
    }
    
    Snake.prototype.remove=remove;

    //删除蛇
    function remove() {
        for (var i = elements.length - 1; i >= 0; i--) {
            // 删除div
            elements[i].parentNode.removeChild(elements[i]);
            // 删除数组中的元素
            elements.splice(i, 1);
        }
    }



    window.Snake = Snake;
})(window,undefined);

// 测试
// var map = document.getElementById('container');
// var s1 = new Snake();
// s1.render(map);
// for(var i=0;i<10;i++){
//     s1.move(map);
// }
